﻿<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;" />
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  <meta name="format-detection" content="telephone=no" />
  <title>跟进</title>
  <link rel="stylesheet" type="text/css" href="../plugins/weui/css/weui.min.css">
  <link rel="stylesheet" type="text/css" href="../css/base.css">
  <link rel="stylesheet" type="text/css" href="../css/css.css">
</head>
<style>
.weui-cells{margin-top:0}
.weui-icon{position:relative;left:90%;top:-18%;width:15px;height:15px}
.editor-bottom{position:fixed;background-color:#fff;width:100%;max-width:640px;height:40px;line-height:40px;text-align:center;font-family:'微软雅黑';font-size:18px;color:#2F363E;letter-spacing:.2em}
.weui-uploader__bd{overflow:visible}
.bottom{bottom:0}
.bottom50{bottom:50px}
.dd{display:flex;justify-content:center;align-items:center}

</style>

<body style="background-color: #F1F0F5">
  <div class="weui-cells weui-cells_form" id="uploader">
    <div class="weui-cell">
      <div class="weui-cell__bd">
        <textarea class="weui-textarea" placeholder="说点什么吧..." rows="3" value=''></textarea>
        <div class="weui-textarea-counter">
          <span id="uploadCount">0</span>/9
        </div>
        <div class="weui-uploader">
          <div class="weui-uploader__bd">
            <ul class="weui-uploader__files" id="uploaderFiles">
            </ul>
            <div class="weui-uploader__input-box">  
              <input id="uploaderInput" class="weui-uploader__input" type="file" accept="image/*" capture="camera" multiple="" />
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <bottom class="editor-bottom bottom50" onclick="addBlog()">发布</bottom>
  <bottom class="editor-bottom bottom" onclick="cacel()">取消</bottom>

  <div id="toast" style="display: none;">
    <div class="weui-mask_transparent"></div>
    <div class="weui-toast">
      <i class="weui-icon-success-no-circle weui-icon_toast"></i>
      <p class="weui-toast__content">已完成</p>
    </div>
  </div>
  <div id="fail" style="display: none;">
    <div class="weui-mask_transparent"></div>
    <div class="weui-toast" style="display: flex;justify-content: flex-start;align-items: center;font-size:16px;">
      <!-- <i class="weui-icon-success-no-circle weui-icon_toast"></i> -->
      <p class="weui-toast__content"></p>
    </div>
  </div>
</body>
<script type="text/javascript" src="../js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="https://res.wx.qq.com/open/libs/weuijs/1.0.0/weui.min.js"></script>
<script type="text/javascript" src="../js/base.js"></script>
<script>
  var uploadCount = 0;
  var upList = [];
  $(function() {
    loadUpload();
    ///loadBtn();
  })

  //发布动态
  function addBlog() {
    var content = $('.weui-textarea').val();
    //if (trim(content) == '') {
    //  Alert("请填写内容");
    //  return;
    //}
    var imgs = upList.join(",");
    if (trim(imgs) == '') {
        Alert("请上传图片");
         return;
    }
    console.log(imgs);
    var param = "uid=" + userid + "&storeid=" + storeid + "&content=" + content + "&imgs=" + imgs;
    ajaxPost(siteApiList.AddBlog, param, function(data) {
      if (!isJsonSuccess(data))
        return;
      Alert("发布成功");
      $('.weui-textarea').val("");
      toUrl("friendState.html");
    })
  }

  function cacel() {
    confirmDialog("确定要退出吗", function() {
      window.history.back()
    })
  }
  //加载上传空间
  function loadUpload() {
    weui.uploader('#uploader', {
        url: siteApiList.UploadBlogImage+"&storeid="+storeid,
      auto: true,
      type: 'file',
      fileVal: 'fileVal',
      compress: {
        width: 1600,
        height: 1600,
        quality: .8
      },
      onBeforeQueued: function(files) {
        // `this` 是轮询到的文件, `files` 是所有文件

        if (["image/jpg", "image/jpeg", "image/png", "image/gif"].indexOf(this.type) < 0) {
          weui.alert('请上传图片');
          return false; // 阻止文件添加
        }
        if (this.size > 10 * 1024 * 1024) {
          weui.alert('请上传不超过10M的图片');
          return false;
        }
        if (files.length > 9) { // 防止一下子选择过多文件
          weui.alert('最多只能上传9张图片，请重新选择');
          return false;
        }
        if (uploadCount + 1 > 9) {
          weui.alert('最多只能上传9张图片');
          return false;
        }

        ++uploadCount;

        // return true; // 阻止默认行为，不插入预览图的框架
      },
      onQueued: function() {
        console.log(this);
        $('#uploadCount').html(uploadCount)
        // console.log(this.status); // 文件的状态：'ready', 'progress', 'success', 'fail'
        // console.log(this.base64); // 如果是base64上传，file.base64可以获得文件的base64

        // this.upload(); // 如果是手动上传，这里可以通过调用upload来实现；也可以用它来实现重传。
        // this.stop(); // 中断上传

        // return true; // 阻止默认行为，不显示预览图的图像
      },
      onBeforeSend: function(data, headers) {
        // $.extend(data, { test: 1 }); // 可以扩展此对象来控制上传参数
        // $.extend(headers, { Origin: 'http://127.0.0.1' }); // 可以扩展此对象来控制上传头部

        // return false; // 阻止文件上传
      },
      onProgress: function(procent) {
        // return true; // 阻止默认行为，不使用默认的进度显示
      },
      onSuccess: function(ret) {
        console.log(ret);
        upList.push(ret.Data);
        console.log(upList);
        // return true; // 阻止默认行为，不使用默认的成功态
      },
      onError: function(err) {
        console.log(this, err);
        // return true; // 阻止默认行为，不使用默认的失败态
      }
    });
  }
</script>

</html>
